<template>
 <div class="con">
  <!-- 返回箭头 -->
  <div class="back">
    <a href="index.html?type=index"><img src="img/left.jpg"/></a>
  </div>
  <!-- 内容 -->
  <div class="main">
    <div class="nowList">
      <ul>
        <li>当前列表</li>
        <li>广州市</li>
      </ul>
    </div>

    <!-- 省 -->
    <div id="province">
      <ul>
        <li class="titleL">省列表</li>
        <li>广东</li>
        <li>江苏</li>
        <li>浙江</li>
        <li>北京</li>
        <li>广西</li>
        <li>湖南</li>
        <li>安徽</li>
        <li>湖北</li>
        <li>天津</li>
        <li>河南</li>
        <li>河北</li>
      </ul>
    </div>

    <!-- 市 -->
    <div id="city">
      <ul>
        <li class="titleL">城市列表</li>
      </ul>
    </div>

    <!-- 区 -->
    <div id="count">
      <ul>
        <li class="titleL">区列表</li>
      </ul>
    </div>
    <div class="di"></div>
  </div>
</div>
</template>

<script>
export default {
  // var province = document.getElementById("province");
  // var city = document.getElementById("city");
  // var count = document.getElementById("count");

  // var chinaArea = JSON.parse(chinaArea);
  // //获取所有省份
  // var provinceList = chinaArea.china.province;

  // //每个省份写入一个option
  // for (var i = 0; i < provinceList.length; i++) {
  //   var option = document.createElement("option");
  //   option.innerHTML = provinceList[i]["-name"];
  //   province.appendChild(option);
  // }
  // province.onchange = function(){
  //   //省份变化之后，市和县也会发生变化
  //   cityDate();
  // }

  // var pIndex = 0;  //存储选择的省份
  // var cIndex = 0;  //存储选择的市
  // function cityDate(){
  //   city.innerHTML = ""; //清空内容
  //   //获取选择的下标，selected 选中元素下标
  //   pIndex = province.selectedIndex; //选择的索引，代表一个元素
  //   console.log(pIndex);

  //   for (var j = 0; j < provinceList[pIndex].city.length; i++) {
  //     var option = document.createElement("option");
  //     option.innerHTML = provinceList[pIndex].city[j]["-name"];
  //     city.appendChild(option);
  //   }
  // }

  // cityDate();
  // cityDate.onchange = function(){
  //   countyDate();
  // }
  // function countyDate(){
  //   count.innerHTML = "";
  //   cIndex = city.selectedIndex;//选择了哪个市
  //   var countList = chinaArea.china.provinceList[pIndex].city[cIndex].county;
  //   for (var k = 0; k < countList.length; k++) {
  //     var option = document.createElement("option");
  //     option.innerHTML = countList[k]["-name"];
  //     count.appendChild(option);
  //   }

  // }
}

</script>

<style scoped>
.main{
  width: 100%;
}
.main ul li{
  height: 0.45rem;
  font-size: 0.15rem;
  line-height: 0.45rem;
  padding-left: 3%;
}
.main #province .titleL{
  background-color: #e6e6e6;
}
.main #city,#count{
  display: none;
}
.di{
  padding: 0.26rem;
}
.con .back a{
  position: fixed;
  width: 5%;
  top: 0.12rem;
  left: 0.05rem;
  z-index: 1222;
}
.con .back img{
  width: 100%;
}
/*.left_img{
  position: absolute;
  display: inline-block;
  width: 3%;
  left: 3%;
}
.left_img img{
  width: 100%;
}*/
html,body{
  width: 100%;
  max-width: 2000px;
} 


</style>
